body{background:#16499A url(http://4.bp.blogspot.com/-KmMWaq-ZYQU/UWwMUiU9uDI/AAAAAAAAIaU/EA0-XzC9PZ4/s1600/bg+windcoki.png);
-webkit-background-size: cover;
 -moz-background-size: cover;
-o-background-size: cover;
        background-size: 100%;
overflow-y:hidden}
#daftar-isi-galeri {margin:70px auto 10px;width:1800px;
 oveflow:auto;
  line-height:0px;-webkit-animation:zoomnav 2s;-moz-animation:zoomnav 2s;-ms-animation:zoomnav 2s;animation:zoomnav 2s;
}

h4#loading {
  margin:0px 0px;
  text-align:center;
  font:bold 12px Arial,Sans-Serif;
  color:white;
  text-shadow:0px -1px 0px rgba(0,0,0,0.2);
  background-color:#F77A28;
  padding:7px 0px;
  border:none;
  width:200px;
  position:fixed !important;
  position:absolute;
  top:0px;
  left:50%;
  margin-left:-100px;
  z-index:99999;
  -webkit-transition:background-color 1s ease-out;
 -moz-transition:background-color 1s ease-out;
  -ms-transition:background-color 1s ease-out;
  -o-transition:background-color 1s ease-out;
  transition:background-color 1s ease-out;
}

h4#loading.litem {background-color:#308733;}
h4#loading.error {background-color:#D0141B;}

.galeri {border:solid 2px #cccccc;display:block;overflow:hidden;width: 260px;height: 140px; position:relative;
  float:left;
  display:block;
  overflow:hidden;
  line-height:0px;
  background:#1049C8;
  margin:4px;
  border:2px solid #4A82FD;
  -webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.7);
  -moz-box-shadow:0px 1px 2px rgba(0,0,0,0.7);
  box-shadow:0px 1px 2px rgba(0,0,0,0.7);
}
.galeri:hover{border:2px solid #0334A3;}
.galeri img {
    background-repeat: repeat, no-repeat;
    background-position: center center;
    -webkit-background-size: auto, cover;
    -moz-background-size: auto, cover;
    -o-background-size: auto, cover;
    background-size: auto, cover;
height:140px;
width:260px; opacity :1.8;

}
.galeri img:hover{opacity :0.8;}


.ttle {
  position:absolute;
  bottom:0;
  left:0;
  display:block;
  width:100%;
  background-color:rgba(0,0,0,0.8);
  word-wrap:break-word;
  overflow:hidden;
  display:none;
}

.ttle .inner {
  padding:7px 10px 10px;
}

.ttle a {
  text-decoration:none;
  font:bold 11px/14px Arial,Sans-Serif;
  color:#D3DAED;
  text-shadow:0px 1px 3px black;
}

.ttle a:hover {
  color:white;
  text-decoration:none;
}

.galeri span {
  font:normal 9px/100% Arial,Sans-Serif;
  color:#bbb;
}

#kotakatas{position:fixed;
top:30px;
left:38px; width:90%;height:40px;top:10px;margin-bottom:40px;}
#metroku {width:980px; height:40px;display:block;}
#welcome { width:980px; height:40px; margin-bottom:35px;}
.welkiri {float:left; font-size:40px; font-family:Century Gothic,Helvetica,Arial; color:#fff;}
.welkanan {box-shadow:0 0 1px #2962E1;width:200px; float:right; font-family:Century Gothic,Helvetica,Arial;}
.welkanan:hover{background:#2962E1}
.welteks {float:left; width:150px; color:#fff;}
.welteks1 { text-align:right; font-size:20px; font-weight:bold;transition:.5s linear;-moz-transition:all .5s;-webkit-transition:.5s linear}.welteks2 {font-size:14px; text-align:right; margin-top:0px;}.welfoto { float:right;padding:4px; width:40px; height:40px; }
.gambar{ opacity:1;}.gambar:hover{opacity:1; box-shadow:0 0 14px #fff;}

.nama_app{margin:10px 0 20px;font-size:40px;font-family:Century Gothic,Helvetica,Arial;
padding:5px 0;color:#fff;}

#sledwido2{position:fixed;top:0px;right:0px; z-index:999;background:#000;font-size:14px;font-family:arial;diplay:block;width:10px;height:100%;color:#fff;opacity:0.5;-webkit-transition:All 0.5s ease-in-out;-moz-transition:All 0.5s ease-in-out}#sledwido2:hover{background:#000000;font-size:20px;font;family:arial;width:90px;height:100%; color:#fff;opacity:0.9;}
.icon{width:50px;padding:18px;margin-top:15px;opacity:1.5}.icon:hover{background:#333333;padding:18px;margin-top:15;}
.credit{display:none;}#credit{display:none;}
.isiinfo{display:none;}
.informasiwidodo{display:none;}

.crd{display:none;position:fixed;bottom:0px;left:0px; z-index:999;background:#000;
  font:normal normal 12px Calibri,Arial; font-variant: normal;clear:both;color:#fff;font-weight:normal;text-align:center;diplay:block;width:100%;height:10px;color:#fff;opacity:0.5;-webkit-transition:All 0.5s ease-in-out;-moz-transition:All 0.5s ease-in-out}.crd:hover{background:#000000;font-size:20px;font;family:arial;width:100%;height:30px; color:#fff;opacity:0.9;}


/*ANIMASI METRO*/
@-webkit-keyframes zoomnav{from{-webkit-transform:translate(-1000px,0px);opacity:0}
to{-webkit-transform:translate(0px,0px);opacity:1.1;}}
@-moz-keyframes zoomnav{from{-moz-transform:translate(-1000px,0px);opacity:0}
to{-moz-transform:translate(0px,0px);opacity:1.1;}}
@-ms-keyframes zoomnav{from{-ms-transform:translate(-1000px,0px);opacity:0}
to{-ms-transform:translate(0px,0px);opacity:1.1;}}
@keyframes zoomnav{from{transform:translate(-1000px,0px);opacity:0}
to{transform:translate(0px,0px);opacity:1.1;}}
